<!DOCTYPE html>
{include file="public/link" /}
<blockquote class="layui-elem-quote">
    数据字段添加
</blockquote>
<div class="layui-card">
    <div class="layui-card-body">
        <form class="layui-form layui-form-pane" action="">
            <div class="layui-form-item">
                <label class="layui-form-label">字段名</label>
                <div class="layui-input-block">
                    <input type="text" name="field" lay-verify="required" placeholder="请输入表名" autocomplete="off"
                        class="layui-input" value="{$find.field}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">备注</label>
                <div class="layui-input-block">
                    <input type="text" name="comment" lay-verify="required" placeholder="请输入备注" autocomplete="off"
                        class="layui-input" value="{$find.comment}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">类型</label>
                <div class="layui-input-inline">
                    <div id="type-demo"></div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">长度</label>
                <div class="layui-input-block">
                    <input type="text" name="length" placeholder="请输入长度" autocomplete="off" class="layui-input"
                        value="{$find.length}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">null</label>
                <div class="layui-input-block">
                    <input type="radio" name="null" value="null" {$find.null=="YES" ?"checked":""} title="is_null">
                    <input type="radio" name="null" value="not null" {$find.null=="NO" ?"checked":""} title="not_null">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">默认</label>
                <div class="layui-input-block">
                    <input type="text" name="default" placeholder="请输入默认" autocomplete="off" class="layui-input"
                        value="{$find.default}">
                </div>
            </div>
            <div class="layui-form-item layui-hide">
                <div class="layui-input-block">
                    <button type="submit" class="layui-btn" lay-submit lay-filter="submit">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
    </div>
</div>

{include file="public/script" /}

<script>
    layui.use(["xmSelect"], function () {
        let form = layui.form
        let $ = layui.$
        let layer = layui.layer
        let xmSelect = layui.xmSelect

        xmSelect.render({
            el: '#type-demo',
            radio: true,
            name: "type",
            initValue: ["{$find.type}"],
            layVerify: "required",
            toolbar: { show: true },
            filterable: true,
            tips: '请选择类型',
            data: [
                { name: 'varchar', value: "varchar" },
                { name: 'int', value: "int" },
                { name: 'tinyint', value: "tinyint" },
                { name: 'bigint', value: "bigint" },
                { name: 'text', value: "text" },
                { name: 'longtext', value: "longtext" },
                { name: 'set', value: "set" },
                { name: 'enum', value: "enum" },
            ], create: function (val, arr) {
                if (arr.length > 0) {
                    let res = true
                    arr.forEach((v, k) => {
                        if (val === v.value) {
                            res = false
                        }
                    })
                    if (res) {
                        return {
                            name: val,
                            value: val
                        }
                    }
                } else {
                    console.log("2", val, arr)
                    return {
                        name: val,
                        value: val
                    }
                }
            }
        })

        // 提交事件
        form.on('submit(submit)', function (data) {
            let field = data.field; // 获取表单全部字段值
            let index = layer.load(0);
            $.post("", field, function (res) {
                if (res.code == 0) {
                    layer.msg(res.msg, {
                        icon: 1
                    }, function () {
                        parent.location.reload()
                    })
                } else {
                    layer.msg(res.msg)
                }
                layer.close(index)
            })

            return false; // 阻止默认 form 跳转
        });
    })
</script>